import {createRouter, createWebHashHistory, Router} from "vue-router";
import NProgress from "@/config/nprogress";

// 定义路由地址，映射组件
const routes = [
    {
        path: "/login",
        name: "Login",
        meta: {
            title: '登录',
            icon: 'User',
            affix: true,
        },
        component: () => import("../views/LoginView.vue"),
    },
];

// 创建路由实例并传递routes配置
const router: Router = createRouter({
    //
    history: createWebHashHistory(),
    routes: routes,
});

// 路由守卫
// NProgress插件的配置使用（进度条加载） 这里做了一个案例，实际项目中应该将nprogress与ajax异步请求绑定
router.beforeEach(async (_to, _from, next) => {
    NProgress.start();
    next();
});

// 路由跳转结束
router.afterEach(() => {
    NProgress.done();
});

// 路由跳转失败
router.onError((error) => {
    NProgress.done();
    console.warn("路由错误", error.message);
});

export default router;
